<template>
  <el-tooltip
    :effect="isDark ? 'dark' : 'light'"
    :content="content"
    placement="top-start"
  >
    <span>
      <slot></slot>
      <el-icon style="cursor: pointer"><QuestionFilled /></el-icon>
    </span>
  </el-tooltip>
</template>

<script>
import { QuestionFilled } from '@element-plus/icons-vue'
export default {
  install(Vue) {
    window.$vueApp.component('Tip', this)
  },
  name: 'Tip',
  components: {},
  props: {
    isDark: {
      type: Boolean,
      default: true,
    },
    content: {
      type: String,
      default: '',
    },
  },
  setup() {
    return {
      QuestionFilled
    }
  }
}
</script>

<style scoped></style>
